<template>
    <div class="page-main single">
        <div class="single-main">
            <div class="text">请输入以下信息</div>
            <div class="form-box">
                <div class="ipt">
                    <span>姓</span>
                    <input type="text" placeholder="请输入您的姓" v-model="familyName" @keyup.enter="search">
                </div>
                <div class="ipt">
                    <span>名</span>
                    <input type="text" placeholder="请输入您的名" v-model="name" @keyup.enter="search">
                </div>
            </div>
            <a href="javascript:" class="search" @click="search">查询</a>
        </div>
        <div class="btm">
            <div class="logo"></div>
            <div class="tit">上海传承家谱家训服务平台</div>
        </div>
    </div>
</template>

<script>
    export default {
        data(){
            return{
                familyName:'',
                name:'',
            }
        },
        computed:{
            isNotEmpty(){ // 判断各个姓名是否为空
                return this.notEmpty(this.familyName, '姓不能为空！') || 
                       this.notEmpty(this.name, '名不能为空！')
            }
        },
        mounted(){
        },
        methods:{
            search(){
                if( this.isNotEmpty ) return;
                let tipsSingleParams = {
                    familyName: this.familyName.trim(),
                    name: this.name.trim(),
                };
                // this.setCookie('tipsSingleParams', JSON.stringify(tipsSingleParams), 24);
                // localStorage.tipsSingleParams = JSON.stringify(tipsSingleParams);
                this.$router.push({ path:"/singleResult", query: {
                    // tipsSingleParams: encodeURIComponent(JSON.stringify(tipsSingleParams)), 
                    tipsSingleParams: JSON.stringify(tipsSingleParams),
                } })
                // this.$router.push('/singleResult');
            }
        }
    }
</script>
